<script setup>
import {defineProps, defineEmits, defineModel, computed} from 'vue';
import {UPDATE_MODEL_EVENT} from "element-plus";
const emit = defineEmits([UPDATE_MODEL_EVENT]);
const model = defineModel();
const changeEvent = async (value) => {
  emit(UPDATE_MODEL_EVENT, value);
}

const modelValue = computed({
  get() {
    return model.value
  },
  set(val) {
    console.log('changing the modelValue in WordFormedTagGroup with val :',val);
    changeEvent(val)
  },
})

function getFunc(){
  console.log(modelValue.value);
}

let cnt=0;
function setFunc(){
  modelValue.value='33'+(cnt++);
}

</script>

<template>
  {{modelValue}}
  <input v-model="modelValue"/>
  <button @click="getFunc">get</button>
  <button @click="setFunc">set</button>
</template>